<script setup lang="ts">
function handleClickLeft() {
  uni.navigateBack()
}

function toAdd() {
  uni.navigateTo({
    url: '/pages/canteenTable/canteenTableAreaAdd',
  })
}
</script>

<template>
  <view class="h-full flex flex-col overflow-hidden">
    <wd-navbar
      title="区域管理"
      :bordered="false"
      left-text="返回"
      left-arrow
      @click-left="handleClickLeft"
    />
    <scroll-view class="box-border flex-1 overflow-hidden" scroll-y :show-scrollbar="false">
      <wd-cell-group border>
        <wd-cell title="大厅" is-link />
        <wd-cell title="一号厅" is-link />
        <wd-cell title="二号厅" is-link />
      </wd-cell-group>
    </scroll-view>
    <view class="flex border-t-1 border-border border-t-solid bg-white p-4">
      <wd-button type="text">
        <view class="flex flex-col items-center justify-center">
          <view class="i-icon-park-outline-sort-two text-main" />
          <text class="mt-1 text-[10px] text-main leading-none">分类排序</text>
        </view>
      </wd-button>
      <wd-button type="text" class="ml-4">
        <view class="flex flex-col items-center justify-center">
          <view class="i-carbon-document text-main" />
          <text class="mt-1 text-[10px] text-main leading-none">修改菜品销售</text>
        </view>
      </wd-button>
      <wd-button type="primary" :round="false" class="ml-4 flex-1" @click="toAdd">
        新建区域
      </wd-button>
    </view>
  </view>
</template>

<style scoped lang="scss"></style>
